<template>
  <div>
    <div class="imageDetail mainTit">
      <p>商品详情</p>
    </div>
    <div
      id="bodyBottomPanel"
      data-height="628"
      class="detail-mobile-body"
      style="position: relative;"
    >
      <div class="nctouch-main-layout">
        <div class="fixed-tab-pannel">
          <div id="bodyGoodsBodyBelowShow">
            <div class="detail-iscroll-wrap">
              <div>
                <div class="img" v-for='item in shop_img' :key="item.value">
                  <img
                    :src="item.value"
                  />
                </div>
                <!---->
              </div>
            </div>
          </div>
          <div class="absolute-block-r" style="position: fixed; z-index: 20;">
            <a href="javascript:void(0);" class="gotop-btn gotop">
              <i></i>
            </a>
          </div>
        </div>
      </div>
    </div>
    <div class="imageDetail mainTit" style="background:rgba(245,245,245)">
      <p>为你推荐</p>
    </div>
  </div>
</template>

<script>
import axios from 'axios'
export default {
    data(){
        return {
            shop_img:[]
        }
    },
    mounted(){
    
        axios(`/special/goods/extend/${this.$route.query.itemId}` , {
        params:{
            _: 1594897725893
        }
        })
        .then(val => {
        this.shop_img = val.data.datas.goodsMobileBodyVoList
        })
    }
};
</script>

<style lang='stylus' scoped>
.mainTit p:after, .mainTit p:before {
    content: ' ';
    height: 1px;
    width: 0.7rem;
    background: #D1D1D1;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}
.mainTit
    height: 0.5rem;
    line-height: 0.5rem;
    color: #333;
    font-size: 0.14rem;
    text-align: center;
    p
        &:before
            right: -0.66rem;
        &:after
            left: -0.66rem;
        margin: auto;
        position: relative;
        width: 1rem;

.nctouch-main-layout 
    img 
        width 100%
</style>